<template>
  <el-form ref="form" :rules="rules" :model="form" label-width="80px">
    <el-form-item label="配置文本">
      <el-input v-model="form.itemText"></el-input>
    </el-form-item>
    <el-form-item label="配置数据">
      <el-input v-model="form.itemValue"></el-input>
    </el-form-item>
    <el-form-item label="配置描述">
      <el-input type="textarea" v-model="form.description"></el-input>
    </el-form-item>
    <el-form-item label="配置排序">
      <el-input v-model="form.sort"></el-input>
    </el-form-item>
    <el-form-item>
      <el-button @click="close">取 消</el-button>
      <el-button type="primary" @click="onSubmit">确 定</el-button>
    </el-form-item>
  </el-form>
</template>

<script>
export default {
  name: "OperaDicData",
  props: {
    dicObj: {
      type: Object,
      required: true
    },
    dialogVisible: {
      type: Boolean,
      required: true
    },
    newData: {
      type: Boolean,
      required: true
    },
    codeId: {
      type: Number,
      required: true
    }
  },
  mounted() {
    this.getItemCode(this.codeId);
  },
  data() {
    return {
      form: {
        id: "",
        itemText: "",
        description: "",
        itemValue: "",
        sort: ""
      },
      rules: {
        sort: [{ type: "number", message: "配置排序必须为数字值" }]
      }
    };
  },
  methods: {
    //通过ID获取此字典的详情
    getItemCode(id) {
      if (id == 0) return;
      this.axios({
        methods: "get",
        url: `sys/dictItem/findOne/${id}`
      }).then(res => {
        this.form = res.data.data;
      }),
        err => {
          console.log(err);
        };
    },
    //清空字符
    clearInput() {
      this.form = {
        itemText: "",
        description: "",
        itemValue: "",
        sort: ""
      };
    },
    //提交保存
    onSubmit() {
      if (this.newData) {
        this.axios({
          method: "post",
          url: "sys/dictItem/save",
          data: {
            dictId: this.dicObj.id,
            itemText: this.form.itemText,
            description: this.form.description,
            itemValue: this.form.itemValue,
            sort: this.form.sort
          }
        }).then(() => {
          this.$message({
            message: "恭喜你，成功创建一条字典",
            type: "success",
            offset: "100"
          });
          this.$emit("dialogVisible", false);
          this.clearInput();
        }),
          err => {
            console.log(err);
          };
      } else {
        this.axios({
          method: "put",
          url: "/sys/dictItem/update",
          data: {
            id: this.codeId,
            dictId: this.dicObj.id,
            itemText: this.form.itemText,
            description: this.form.description,
            itemValue: this.form.itemValue,
            sort: this.form.sort
          }
        }).then(() => {
          this.$message({
            message: "恭喜你，成功修改一个字典配置",
            type: "success",
            offset: "100"
          });
          this.$emit("dialogVisible", false);
          this.clearInput();
        }),
          err => {
            console.log(err);
          };
      }
    },
    close() {
      this.$emit("dialogVisible", false);
      this.clearInput();
    }
  }
};
</script>
<style lang="less"></style>
